@breadcrumb-prefix-cls: ~"@{css-prefix}breadcrumb";
@breadcrumb-back-prefix-cls: ~'@{breadcrumb-prefix-cls}-back';

.@{breadcrumb-prefix-cls} {
  color: @breadcrumb-text-color;
  font-size: @font-size-middle;
  
  .@{breadcrumb-back-prefix-cls} a,
  a {
    color: @primary-color;
    transition: color @transition-time @ease-in-out;
    &:hover {
      color: @breadcrumb-hover-color;
    }
    &:active {
      color: @primary-color;
    }
  }

  & > span:last-child &-item-separator {
    display: none;
  }

  &-item-separator {
    margin: 0 5px;
    color: @breadcrumb-separator-color;
  }

  &-item-link {
    > .haloe-icon + span {
      margin-left: 4px;
    }
  }

  &-btn-back {
    margin-right: 10px;
    vertical-align: baseline;
    .haloe-icon {
      vertical-align: baseline;
    }
  }

  &-item-disabled {
    cursor: not-allowed;
    a {
      pointer-events: none;
      color: @breadcrumb-disabled-color;
    }
    
  }
}
